<template>
  <div class="areaselect" id="areaselect">
    <van-dropdown-menu get-container="#areaselect">
      <van-dropdown-item v-model="regionValue" :options="region" @change="bara" />
      <van-dropdown-item v-model="streetValue" :options="street" @change="bara2" />
      <van-dropdown-item v-model="value2" :options="types" @change="barb(value2)" />
      <van-dropdown-item v-model="value3" :options="states" @change="barc(value3)" />
    </van-dropdown-menu>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        regionValue: "",
        streetValue: "",
        value2: "",
        value3: "",
        area: {},
        columns: [{
            values: [],
            valuesorigin: [],
            className: "column1"
          },
          {
            values: [],
            valuesorigin: [],
            className: "column2"
          }
        ],
        region: [{
          text: "全部街镇",
          value: ""
        }], //活动区域
        street: [{
          text: "全部村社区",
          value: ""
        }],
        types: [{
          text: "全部类型",
          value: ""
        }], // 活动类型
        states: [{
          text: "全部状态",
          value: ""
        }] // 活动状态
      };
    },
    props: {
      listData: {}
    },
    created() {
      this.region.push({
        text: '河口区',
        value: '河口区'
      });
    },
    mounted() {
      this.zoneAction(() => {
        this.rquestPostTemperature();
      });
      this.slow.getDictionaryValus("activityType").then(ret => {
        console.log(ret);
        ret.forEach(m => {
          this.types.push({
            text: m.text,
            value: m.value
          });
        });
      });
      this.slow.getDictionaryValus("activityStatus").then(ret => {
        console.log(ret);
        ret.forEach(m => {
          this.states.push({
            text: m.text,
            value: m.value
          });
        });
      });
    },
    methods: {
      bara() {
        this.$emit("load", [this.regionValue, this.value2, this.value3]);
        this.street[0].value = this.regionValue;
        this.streetValue = this.regionValue;
        let id = "";
        this.columns[0].valuesorigin.forEach(e => {
          if (e.dataAreaCode == this.regionValue) {
            id = e.id;
          }
        });
        let ab = [{
          text: "全部村社区",
          value: this.regionValue
        }];
        this.area.Committe.forEach(e => {
          if (e.parentId == id) {
            ab.push({
              text: e.name,
              value: e.dataAreaCode
            });
          }
        });
        this.street = ab;
      },
      bara2() {
        this.$emit("load", [this.streetValue || this.regionValue, this.value2, this.value3]);
      },
      barb() {
        this.$emit("load", [this.streetValue || this.regionValue, this.value2, this.value3]);
      },
      barc() {
        this.$emit("load", [this.streetValue || this.regionValue, this.value2, this.value3]);
      },
      rquestPostTemperature() {
        this.$toast.loading({
          message: "区划加载中...",
          forbidClick: true
        });
        this.post("region/regionTree")
          .then(res => {
            this.$toast.clear();
            this.area = res.map;
            this.area.street.forEach(element => {
              if (element.parentId === this.area.area[0].id) {
                this.columns[0].valuesorigin.push(element);
                this.columns[0].values.push(element.name);
              }
            });
            let ab = [{
              text: "全部村社区",
              value: this.regionValue
            }];
            let streetValue = "";
            let abparentId = "";
            this.area.Committe.forEach(element => {
              if (element.parentId === this.columns[0].valuesorigin[0].id) {
                this.columns[1].valuesorigin.push(element);
                this.columns[1].values.push(element.name);
              }
              if (
                element.dataAreaCode == sessionStorage.getItem("dataAreaCode")
              ) {
                abparentId = element.parentId;
                streetValue = element.dataAreaCode;
              }
            });
            this.area.street.forEach(e => {
              if (abparentId === e.id) {
                this.regionValue = e.dataAreaCode;
                ab[0].value = e.dataAreaCode;
                this.area.Committe.forEach(ep => {
                  if (ep.parentId == e.id) {
                    ab.push({
                      text: ep.name,
                      value: ep.dataAreaCode
                    });
                  }
                });
              }
            });
            this.street = ab;
            this.streetValue = streetValue;
          })
          .catch(err => {
            this.$toast.clear();
            console.log("异常", err);
          });
      },
      zoneAction(cb) {
        this.post("community_activity/regiontype")
          .then(r => {
            r.list.forEach(element => {
              if (this.region) {
                this.region.push({
                  text: element.regionName,
                  value: element.regionCode
                });
              } else {
                this.region.push({
                  text: "活动区域",
                  value: "0"
                });
              }
              this.region.forEach(e => {
                if (e.value == sessionStorage.getItem("dataAreaCode")) {
                  this.regionValue = e.value;
                }
              });
              cb && cb();
            });
          })
          .catch(err => {});
      }
    },
    destroyed() {}
  };
</script>